<template>
  <el-table :data="users" style="width: 100%">
    <el-table-column label="编号" prop="id" />
    <el-table-column label="账号" prop="username" />
    <el-table-column label="密码" prop="password" />
    <el-table-column align="right">
      <template #header>
        <el-input v-model="keyword" size="small" placeholder="搜索用户" />
      </template>
      <template #default="scope">
        <el-button size="small" >
          Edit
        </el-button>
        <el-button
            size="small"
            type="danger"
        >
          Delete
        </el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  name: "UserView",
  data() {
    return {
      users: [],
      keyword:''
    };
  },
  methods: {
    loadUsers() {
      // 使用axios请求后台
      this.$axios.get('/users/list')
          .then(result => {
            if (result.data.status === 1) {
              this.users = result.data.data.data;
            }
          })
          .catch(error => {
            console.error("加载用户数据失败:", error);
          });
    }
  },
  mounted() {
    this.loadUsers();
  }
};
</script>

<style scoped>

</style>